<template>
	<view class="app-login">
		<image :src="comm_img_url+'/pro/account-bg-top.png'" class="bg-top"></image>
		<!-- #ifdef MP-WEIXIN -->
		<view class="icon-back" @click="back" :style="'top:'+nav_height+'px'">
			<u-icon name="arrow-left" color="#fff" size="20"></u-icon>
		</view>
		<!-- #endif -->
		<view class="login">
			<image src="/static/img/head.png" class="login-logo"></image>
			<view class="login-title">
				你好，欢迎来到伊姿漾
			</view>
			<view class="mode flex-box">
				<input type="number" v-model="input.tel" class="box-1" maxlength="11" placeholder="请输入手机号" />
			</view>
			<view class="mode flex-box">
				<input type="text" v-model="input.auth_code" class="box-1" maxlength="6" placeholder="输入验证码" />
				<!-- <u-verification-code :seconds="60" ref="uCode" @change="codeChange"></u-verification-code> -->
				<u-code :seconds="seconds" ref="uCode" @change="codeChange"></u-code>
				<text class="getcode" @tap="getAuthCode">{{code_text}}</text>
			</view>
			<!-- <view class="mode flex-box">
				<input type="password" v-model="input.pwd" class="box-1" placeholder="请输入密码" />
			</view> -->
			<view class="mode flex-box" v-if="is_reg">
				<input type="text" v-model="refer_code" class="box-1" placeholder="请输入邀请码" />
				<!-- <u-icon name="scan" size="42" @tap="doScan"></u-icon> -->
			</view>
			<button hover-class="none" class="btn-log" :disabled="is_loading" :loading="is_loading" @tap="sendLogin">登录</button>
			<!-- <view class="flex-box btn-nav">
				<text @tap="$u.route('/pages/account/forget')">忘记密码?</text>
				<view class="btn-line"></view>
				<text @tap="$u.route('/pages/account/reg')">立即注册</text>
			</view> -->
			<view class=" tips-text">
				———— 第三方登录方式 ————
			</view>
			<!--#ifdef APP-PLUS-->
			<image :src="comm_img_url+'/wechart-login.png'" class="icon-login" @tap="wxLogin"></image>
			<!-- <image src="@/static/dl-icon1.png" class="icon-login" @tap="wxLogin"></image> -->
			<!-- #endif -->
			<!--#ifdef MP-WEIXIN -->
			<!-- <image :src="comm_img_url+'/wechart-login.png'" class="icon-login"
				@tap="$u.route('/pages/account/wxLogin',{back:1})"></image> -->
				<image src="/static/dl-icon1.png" class="icon-login" @tap="$u.route('/pages/login/wxLogin?scene='+this.refer_code,{back:1})"></image>
			<!-- #endif -->
		</view>
		<image :src="comm_img_url+'/pro/account-bg-bottom.png'" class="bg-bottom"></image>
	</view>
</template>
<script>
	// import app from "@/common/js/comm_url.js";
	import {
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				seconds: 60,
				comm_img_url: null,
				input: {
					tel: '',
					auth_code: '',
					// pwd: ''
				},
				refer_code: '',
				code_text: '获取验证码',
				is_loading: false,
				is_reg: false,
				nav_height:'25',
				isBack:false,
			}
		},
		onLoad(option) {
			this.comm_img_url = this.$c.appImg
			console.log(this.$c.appImg,9999999)
			uni.$on('init_tel', ret => {
				this.input.tel = ret
			});
			// #ifdef MP-WEIXIN
			uni.getSystemInfo({
				success:res=>{
					// console.log('状态栏高度',res.statusBarHeight);
					this.nav_height = res.statusBarHeight
				}
			})
			console.log('option',option,uni.getStorageSync("code"),999999)
			
			
			if(option.scene&&option.scene!=0){
				this.is_reg = true
				this.refer_code = option.scene
			}else{
				this.refer_code = uni.getStorageSync("code");
			}
			if(this.refer_code){
				// this.is_reg = true
				uni.setStorageSync("newcode",1);
			}else{
				this.is_reg = false
				uni.removeStorageSync("newcode");
			}
			//#endif
			if(option.back==1){
				this.isBack = true
			}
			
		},
		onBackPress() {
			return false
		},
		methods: {
			...mapMutations(['login']),
			back(){
				uni.navigateBack()
			},
			getAuthCode() {
				if (!this.input.tel) {
					uni.showToast({
						icon: 'none',
						title: '请输入手机号'
					})
					return
				}
				if (this.$refs.uCode.canGetCode) {
					// 模拟向后端请求验证码
					this.$u.api.smsCode({
							flag: 'login',
							tel: this.input.tel
						})
						.then(res => {
							if (res.status) {
								this.$refs.uCode.start();
								return
							}
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						})
						.catch(err => {
							console.log(err);

						})
				}
			},
			codeChange(text) {
				this.code_text = text;
			},
			checkingNull() {
				if (!this.input.tel) {
					uni.showToast({
						icon: 'none',
						title: '请输入您的手机号码'
					})
					return false
				}
				if (!this.$u.test.mobile(this.input.tel)) {
					uni.showToast({
						icon: 'none',
						title: '您输入的手机号码有误'
					})
					return false
				}
				if (!this.input.auth_code) {
					uni.showToast({
						icon: 'none',
						title: '请输入验证码'
					})
					return false
				}
				if (!this.$u.test.code(this.input.auth_code, 6)) {
					uni.showToast({
						icon: 'none',
						title: '验证码有误'
					})
					return false
				}
				// if (!this.input.pwd) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '请输入登录密码'
				// 	})
				// 	return false
				// }
				return true
			},
			sendLogin() {
				if (!this.checkingNull()) return;
				this.is_loading = true
				if (this.is_reg) {
					if (!this.refer_code) {
						uni.showToast({
							icon: 'none',
							title: '请输入邀请码'
						})
						return
					}
					this.input.refer_code = this.refer_code
					this.$u.api.loginReg(this.input)
						.then(res => {
							this.is_loading = false
							console.log(res);
							if (res.status) {
								uni.setStorageSync('token', res.msg.token);
								uni.setStorageSync('userInfo', res.msg.userinfo);
								
								this.login();
								console.log('状态1',this.isBack)
								if(this.isBack){
									uni.navigateBack()
								}else{
									uni.switchTab({
										url: "/pages/home/home"
									});
								}
								return
							}
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						})
						.catch(err => {
							this.is_loading = false
							console.log(err)
							uni.showToast({
								icon: 'none',
								title: "网络异常，请稍后再试"
							})
						})
				} else {
					
					this.$u.api.doLogin(this.input).then(res => {
							this.is_loading = false
							if (res.status) {
								uni.setStorageSync('token', res.msg.token);
								uni.setStorageSync('userInfo', res.msg.userinfo);
								this.login();
								
								console.log('状态2',this.isBack)
								if(this.isBack){
									uni.navigateBack()
								}else{
									uni.switchTab({
										url: "/pages/converge/converge"
									});
								}
								return
							}
							if (res.code == -10) {
								this.is_reg = true
								return
							}
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						})
						.catch(err => {
							this.is_loading = false
							console.log(err)
							uni.showToast({
								icon: 'none',
								title: "网络异常，请稍后再试"
							})
						})
				}
			},
			wxLogin() {
				uni.showLoading({
					title: '登录中'
				})
				/*获取服务商*/
				let that = this;
				let params = {};
				uni.getProvider({
					service: 'oauth',
					success: function(res) {
						uni.login({
							provider: 'weixin',
							success: function(loginRes) {
								/*获取用户信息*/
								params.code = loginRes.code
								//app微信登录
								//#ifdef APP-PLUS
								uni.getUserInfo({
									desc: '获取微信信息',
									success: function(infoRes) {
										// console.log(infoRes);
										params.iv = infoRes.iv
										params.encryptedData = infoRes.encryptedData
										params.oauth = 'APP'
										params.nickname = infoRes.userInfo.nickName
										params.head_pic = infoRes.userInfo.avatarUrl
										params.sex = infoRes.userInfo.gender
										params.openid = infoRes.userInfo.openId
										params.unionid = infoRes.userInfo.unionId
										that.$u.api.wXLogin(params).then(res => {
											uni.hideLoading()
											// console.log(res);
											if (res.status) {
												uni.setStorageSync('token', res
													.msg.token);
												uni.setStorageSync('userInfo',
													res.msg.userinfo);
												that.login();
												console.log('状态3',that.isBack)
												if(that.isBack){
													uni.navigateBack()
												}else{
													uni.switchTab({
														url: "/pages/home/home"
													});
												}
											} else if (res.code == -10) {
												uni.navigateTo({
													url: './bind_tel?item=' +JSON.stringify(params)
												})
											} else {
												uni.showToast({
													icon: 'none',
													title: res.msg
												})
											}

										})
									}
								});
								//#endif
							}
						});
					}
				})
			},
			getURLParam(url) {
				var querys = url.substring(url.indexOf('?') + 1).split('&');
				console.log(querys,'querys')
					var result=[];
					for(var i=0;i<querys.length;i++){
						var temp=querys[i].split('=');
						if(temp.length<2){
							result[temp[0]]='';
						}else{
							console.log(temp[0],temp[1],99999)
							result[0]=temp[1];
						}
					}
					console.log(result,'result')
					return result
			},
			doScan() {
				let that = this
				uni.scanCode({
					scanType:'qrCode',
					success: res => {
						var url = res.path;
						let scene = that.getURLParam(url)
						console.log(res,scene,'信息222')
						// var reg = new RegExp("/\?code=([^&]*)(&|$)", "i");
						// var r = url.match(reg);
						console.log(scene,'信息')
						if(scene){
							this.refer_code = scene;
						}else{
							uni.showToast({
								title: '无法识别推荐码',
								icon: 'none'
							})
						}
						// if (r != null) {
						// 	this.refer_code = r[1];
						// } else {
						// 	uni.showToast({
						// 		title: '无法识别推荐码',
						// 		icon: 'none'
						// 	})
						// }
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	// @import url('@/common/css/comm.less');
	page {
		background: #fff;
	}
	.icon-back{
		width: 70rpx;
		height: 70rpx;
		position: absolute;
		// top: var(--status-bar-height);
		left:20rpx;
		z-index: 2;
		text-align: center;
		line-height: 75rpx;
		padding-right: 5rpx;
		// margin-top:20rpx;
		border-radius: 50%;
		background: rgba(0,0,0,0.5);
		padding-top:15rpx;
		padding-left:10rpx;
	}

	.bg-top {
		position: absolute;
		top: 0;
		right: 0;
		width: 396rpx;
		height: 432rpx;
		z-index: -1;
	}

	.bg-bottom {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 304rpx;
		height: 370rpx;
		z-index: -1;
	}

	.login {
		position: absolute;
		top: 30%;
		width: 600rpx;
		left: 50%;
		transform: translate(-50%, -20%);
	}

	.login-logo {
		display: block;
		width: 150rpx;
		height: 150rpx;
		margin: 30rpx auto;
		// box-shadow: 0px 2px 33px 2px rgba(138, 213, 191, 0.51);
		border-radius: 50%;

	}

	.app-login {
		padding: 30rpx;
		position: relative;
		z-index: 1;
		min-height: 100vh;
		display: block;

		button {
			font-size:34rpx;
			margin: 60rpx auto 0;
			width: 100%;
			background-image: linear-gradient(to right,#e9d2fa,#be8ff0);
		}

		.mode {
			padding: 30rpx 0;
			border-bottom: 1px solid #EEEEEE;

			.getcode {
				min-width: 160rpx;
				text-align: center;
				border-left: 1px solid #EEEEEE;
				padding-left: 20rpx;
			}
		}

		.login-title {
			font-size:36rpx;
			color:#333;
			font-weight: bold;
			margin-bottom: 50rpx;
			text-align: center;
		}
	}
	.btn-log{
		border-radius: 50rpx;
		color:#fff;
	}
	.tips-text {
		text-align: center;
		margin-top: 30rpx;
		color:#bbbbbb;
		font-size: 26rpx;
	}

	.btn-nav {
		padding: 40rpx 0;
		justify-content: center;	
	}

	.btn-line {
		width: 2rpx;
		height: 30rpx;
		margin: 0 20rpx;
		background: #bbb;
	}

	.icon-login {
		display: block;
		width: 88rpx;
		height: 88rpx;
		margin: 20rpx auto;
	}

	.weixin {
		outline: none;
		border: 0;
		border-radius: 100%;
		background: transparent;
	}
</style>
